<!DOCTYPE html>
<html lang="en">
<head>
	<title>網頁編輯</title>
	<!-- Required meta tags -->
	<meta charset="UTF-8" />
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta http-equiv="Access-Control-Allow-Origin" content="*">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">

	<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="css/bootstrap.css">
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<link rel="stylesheet" href="fonts/font/iconfont.css">

	<link rel="stylesheet" href="css/index.css" />
	<script src="component/jquery.min.js"></script>
	<!-- <script src="component/require.js"></script> -->
	<script src="component/modules/web_module.js"></script>
	<script src="component/app.js"></script>
	<script type="text/javascript">
		var URL_INFO = URL_INFO || {};

		window.rootPath = (function (src) {
			src = document.currentScript
			? document.currentScript.src
			: document.scripts[document.scripts.length - 1].src;
			return src.substring(0, src.lastIndexOf("/") + 1);
		})();
		window.baseUrl = window.rootPath;
		
		window.baseUrl = '';
		window.apkey = 'dfsfd';
		window.apiUrl = baseUrl + '/backend';
		window.urlInfo = {
		    'page':{
		        'webeditor': apiUrl + '/page/default/editor',
		    },
		    'upload':{
		        'iframe': baseUrl + '/filemanager/dialog.php',
		    }
		};

	</script>
</head>

<body style="height: 100%; position: fixed; width: 100%">
	<div class="LdgFormButton">
		<div class="pull-left"><p>内容编辑->右键 【修改 删除】</p></div>
		<div class="pull-right">
			<button class="btn btn-info btn-xs ldgFormImport" type="button"><span class="glyphicon glyphicon-save" aria-hidden="true"></span>發布</button>
			<button class="btn btn-success btn-xs ldgFormPreview" type="button"><span class="glyphicon glyphicon-sunglasses" aria-hidden="true"></span>保存并預覽</button>
			<div class="language-list ">
				<div class="input-group">
					<select class="form-control" name="language"><option value="zh-TW">繁</option><option value="zh-CN">簡</option><option value="en_US">EN</option></select>
					<span class="input-group-btn"><button type="button" class="btn btn-default data-language">使用其它語言內容</button></span>
					<span class="input-group-btn"><button type="button" class="btn btn-primary data-change-language">切換語言</button></span>
				</div>
			</div>
		</div>
	</div>
	<div id="app"></div>
	<script>
		// require(['component/app'], function(webEditor) {
			
	    //   //回调函数
	    // });
		webEditor.use(['panel', 'menu', 'tools'], async function(){
			var panel = webEditor.panel;
			var tools = webEditor.tools;
			var menu = webEditor.menu;
			var menuData = await ajaxGet($, rootPath+'data/menu.json');
			panel.render({
				ele:"#app"
			});
			menu.render(menuData);

			// 提交預覽
			$(document).on("click", ".ldgFormPreview", function(){
				editorData("preview");
				return false;
			});

			// 提交發布
			$(document).on("click", ".ldgFormImport", function(){
				editorData("release");
				return false;
			});

			// 使用其他語言的數據
			$(document).on("click", ".data-language", async function(){
				var language = $("select[name='language']").val();
				
				var id = getQuery("id");
				var type = getQuery("type");
				dragObj.clear();
				setUrlData(id, language, type);
			});
			// 切換語言
			$(document).on("click", ".data-change-language", async function(){
				var language = $("select[name='language']").val();
				if(confirm("是否離開當前頁面切換"+language+"到語言?數據不會自動保存!")){
					var id = getQuery("id");
					var type = getQuery("type");
					window.location.href = urlBuild('webeditor',{id:id, lang:language, type:type});
				}
			});
			
			function editorData(model){
				var id = getQuery("id");
				var lang = getQuery("lang");
				var type = getQuery("type");
				var csrfP = $("meta[name='csrf-param']").attr("content");
				var csrfV = $("meta[name='csrf-token']").attr("content");
				var postData = {
					model:model,
					data:dragObj.getData()
				};
				postData[csrfP] = csrfV;
				$.ajax({
					url:buildUrl(urlInfo.page.webeditor,{id:id, lang:lang, type:type}),
					data: postData,
					type:"POST",
					success:function(data){
						console.log(data);
						if(data.message){
							alert(data.message);
						}
						if(model == 'preview' && data.url){
							window.open(data.url, "_blank");
						}
					},
					error:function(err){
						console.log(err);
					}
				});
			}
			async function setUrlData(id, lang, type){
				var data = await ajaxGet($, rootPath+'data/page.json', {id:id, lang:lang, type:type});
				console.log(data);
				if(data){
					data = '<root><tabs id="tabs_1735394642791_0" data="{&quot;name&quot;:&quot;標籤頁&quot;,&quot;type&quot;:&quot;tabs&quot;,&quot;value&quot;:{&quot;title&quot;:&quot;bbbb&quot;,&quot;options&quot;:&quot;bbbbbb&quot;,&quot;class&quot;:&quot;&quot;,&quot;class_id&quot;:&quot;&quot;,&quot;style&quot;:&quot;&quot;,&quot;content&quot;:{&quot;title&quot;:[&quot;aaaa&quot;,&quot;bbbb&quot;],&quot;options&quot;:[&quot;aaaaaaa&quot;,&quot;bbbbbb&quot;]}},&quot;id&quot;:&quot;tabs_1735394642791_0&quot;}"/></root>';
					webEditor.widgetsDone(function(){
						dragObj.initFormXml(data);
						// for(var x in data){
						// 	var model = dragObj.objToControl(data[x]);
						// 	dragObj.addControlObject(model);						
						// }
					});					
				}
				// if(data.status&& data.data!=''){
				// 	var datas = toJSON(data.data);
				// 	if(datas==false){
				// 		// datas = '<root><tabs id="tabs_1735394642791_0" data="{&quot;name&quot;:&quot;標籤頁&quot;,&quot;type&quot;:&quot;tabs&quot;,&quot;value&quot;:{&quot;title&quot;:&quot;bbbb&quot;,&quot;options&quot;:&quot;bbbbbb&quot;,&quot;class&quot;:&quot;&quot;,&quot;class_id&quot;:&quot;&quot;,&quot;style&quot;:&quot;&quot;,&quot;content&quot;:{&quot;title&quot;:[&quot;aaaa&quot;,&quot;bbbb&quot;],&quot;options&quot;:[&quot;aaaaaaa&quot;,&quot;bbbbbb&quot;]}},&quot;id&quot;:&quot;tabs_1735394642791_0&quot;}"/></root>';
				// 		datas = data.data;
				// 		// console.log(datas);
				// 		webEditor.widgetsDone(function(){
				// 			dragObj.initFormXml(datas);
				// 		});		
				// 	}else{
				// 		webEditor.widgetsDone(function(){
				// 			dragObj.initFormOldData(datas);
				// 		});	
				// 	}
				// }
			}
			async function loadDefaultData(){
				var id = getQuery("id");
				var lang = getQuery("lang");
				var type = getQuery("type");
				setUrlData(id, lang, type);
			}
			
			loadDefaultData();
		});
	</script>

</body>
</html>